<!DOCTYPE html>

<html>

	<head>

		<!-- 页面字符编码 -->

		<meta charset="utf-8">

		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">

		<meta name="apple-mobile-web-app-capable" content="yes">

		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<title></title>
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link href="../../fonts/iconfont.css" rel="stylesheet" />
		<link href="../../css/navigation_index.css" rel="stylesheet" />
		<script type="text/javascript" src="../../js/mui.min.js"></script>
		<script type="text/javascript" src="../../js/jquery-2.1.0.js"></script>

	</head>

	<body>

		<div class="mui-content part4">

		    <div id="header">
		       
		       <div class="search_tips">
		       		<div class="search_tips_a">
		   		       	<span class="iconfont icon-sousuo serach_icon"></span>
						<c>Search by name</c>    			
		       		</div>

		       </div> 

		       <input type="text"  class="mui-input-clear phone_input">	
		         	
		    </div>	


		   <div class="nav_sex">
		   	   <div>
		   	   	   <ul>
		   	   	   	  <li>MEN</li>
		   	   	   	  <li class="light">WOMEN</li>
		   	   	   </ul>
		   	   </div>
		   </div>


		    <div class="nav_mui-row  part8">
		         <ul class="mui-table-view"> 
			        <li class="mui-table-view-cell mui-collapse">
			            <a class="" href="#">Shoes</a>
			            
			        </li>

			        <li  class="mui-table-view-cell mui-collapse  lBtn">
			            <a class="" href="#">Bags<i  class="iconfont icon-down"></i></a>
			            <div  class="mui-collapse-content rewrite">
			                <p>Duffle Bags</p>
			                <p>Flight Bags</p>
			                <p>Holddalls</p>
			                <p>Laptop Bags</p>
			            </div>
			        </li>

			        <li class="mui-table-view-cell mui-collapse lBtn">
			            <a class="" href="#">T-shirts<i class="iconfont icon-down"></i></a>
			            
			        </li>

			        <li class="mui-table-view-cell mui-collapse">
			            <a class="" href="#">Blazers</a>
			            
			        </li>

			        <li class="mui-table-view-cell mui-collapse lBtn">
			            <a class="" href="#">Jumpers<i class="iconfont icon-down"></i></a>
			            
			        </li>
			        <li class="mui-table-view-cell mui-collapse">
			            <a class="" href="#">Sunglasses</a>
			            
			        </li>

			    </ul>
		       
		    </div>



			<div class="mui-seticon mui-seticon_bottom part8-footer"> 
			    <div class="part8-footer-auto">
			        <div class="iconfont  icon-yonghu1"></div>
			        <div class="part8-mid icon-mid">
			            <div class="iconfont  icon-daizi3"></div>
			            <span class="navy blue">3</span>
			        </div>
			        <div class="iconfont icon-tuichu"></div>
		        </div>
			</div>

           
			

		</div>





	</body>

</html>
<script>


	$('.lBtn').on('tap',function(){
		if($(this).find('i.iconfont').hasClass('icon-down')){
			$(this).find('i.iconfont').removeClass('icon-down');
			$(this).find('i.iconfont').addClass('icon-fold');
		}else{
			$(this).find('i.iconfont').addClass('icon-down');
			$(this).find('i.iconfont').removeClass('icon-fold');
		}
	});

</script>